﻿@model GroceryList.Front.Web.ViewModels.ListaCompraDto
@{
    Layout = null;
    var masterDisabled = (Model.Codigo!=null)?"disabled":"";
}
<!DOCTYPE html>
<html>
<head>
    <title>ViewPage1</title>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" media="screen" />
    <link href="@Url.Content("~/Content/themes/base/jquery.ui.datepicker.css")" rel="stylesheet" type="text/css" media="screen" />
    <link href="@Url.Content("~/Content/themes/base/jquery.ui.theme.css")" rel="stylesheet" type="text/css" media="screen" />
    <link href="@Url.Content("~/Content/themes/base/jquery.ui.base.css")" rel="stylesheet" type="text/css" media="screen" />
    <link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
    <script type="text/javascript">
            $(document).ready(function () {
                $.ajax({
                        url: "@Url.Action("BuscarDetalles")",
                        type: "GET",
                        data: {codigoLista:"@Model.Codigo",terminoDeBusqueda: ""},
                        beforeSend: function() {     $('#loader').show()  },
                        complete: function(){     $('#loader').hide()  },
                        success: function (data, responseStatus, jQXHR)
                        {
                            $("#DetallesAjax").html(data);
                        }
                    });

                $("#filtrar").bind("click", function () {
                    var value="";
                    if($("#terminoBusqueda").val().length > 0) 
                    {
                        value = $("#terminoBusqueda").val();
                    }
                    $.ajax({
                        url: "@Url.Action("BuscarDetalles")",
                        type: "GET",
                        data: {codigoLista:"@Model.Codigo",terminoDeBusqueda: value},
                        beforeSend: function() {     $('#loader').show();$('#DetallesAjax').hide();  },
                        complete: function(){     $('#loader').hide();$('#DetallesAjax').show();  },
                        success: function (data, responseStatus, jQXHR)
                        {
                            $("#DetallesAjax").html(data);
                        }
                    });
                });

                $("#terminoBusqueda").bind("keypress", function (e) {
                if(e.keyCode==13){

                    var value="";
                    if($("#terminoBusqueda").val().length > 0) 
                    {
                        value = $("#terminoBusqueda").val();
                    }
                    $.ajax({
                        url: "@Url.Action("BuscarDetalles")",
                        type: "GET",
                        data: {codigoLista:"@Model.Codigo",terminoDeBusqueda: value},
                        beforeSend: function() {     $('#loader').show();$('#DetallesAjax').hide();  },
                        complete: function(){     $('#loader').hide();$('#DetallesAjax').show();  },
                        success: function (data, responseStatus, jQXHR)
                        {
                            $("#DetallesAjax").html(data);
                        }
                    });
                    if (e.stopPropagation) {
                e.stopPropagation();
                e.preventDefault();
        }

                    }
                });


            })
    </script>
    <a href="@Url.Action("Index", "Home")">Lists</a>

    @using (Html.BeginForm())
    {
        @Html.ValidationSummary(true)
        <fieldset>
            <legend>Lista</legend>
            <div class="editor-label">
                @Html.LabelFor(model => model.Nombre)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.Nombre)
                @Html.ValidationMessageFor(model => model.Nombre)
            </div>
            <div class="editor-label">
                @Html.LabelFor(model => model.Fecha)
            </div>
            <div class="editor-field">
                @Html.TextBox("Fecha", Model.Fecha.ToString("dd/MM/yyyy"), new { @class = "date" })
                <script type="text/javascript">

                    $(document).ready(function () {
                        $('.date').datepicker({ dateFormat: "dd/mm/yy" });
                    });    
    
                </script>
            </div>

        </fieldset>
            
        <fieldset>
            <legend>Detalles</legend>
            <div>
                <input type="text" id="terminoBusqueda" /> <a href="#" id="filtrar">Filtrar!!!</a> 

            </div>
            <div id="loader">Wait...</div>
            <div id="DetallesAjax"></div>

        </fieldset>    
        <p>
            <input type="submit" value="Save" />
        </p>
    }
</body>
</html>
